<div class="modal-header">
  <h4 class="modal-title text-center">Add Group</h4>
</div>
<div class="modal-body">
  <form [formGroup]="form" (submit)="submit()">
  <div class="form-group">
    <p>ASINS:</p>
    <textarea name="name" rows="8" cols="78" placeholder="Please enter ASIN to be added, multiple ASIN Please use the carriage-return, each input up to 10 ASIN"></textarea>
    <div *ngIf="form.get('asin').errors && form.get('asin').touched ">
      <span class="text-danger">asin is not null!</span>
    </div>
  <!--   <div *ngIf="form.get('asin').errors || form.hasError('asinsError') && form.get('asin').touched">
      <p class="text-danger">
        ASIN format is incorrect ! Up to 10 ASINs can be imported at one time!
      </p>
    </div> -->
  </div>
  <div class="from-group" id="tag-box">
    <p>Suggest Tags:</p>
    <span class="tag-span gray">Hight price</span>
    <span class="tag-span primary">Auto</span>
    <span class="tag-span success">Art</span>
    <span class="tag-span danger">VIP</span>
    <span class="tag-span festival">festival</span>
    <span class="tag-span temp">Temp Vacuum</span>
  </div>

  <div class="row">
    <div class="col-sm-6">
      <i class="fa fa-plus-sign-alt"></i>
      Add notify rule:
      <app-condition-builder (ConditionsItemsGroups)="getConditionsGroupsItems($event)"></app-condition-builder>
    </div>
  </div>
  <hr/>
  <div class="row">
    <button type="button" data-dismiss="modal" class="btn btn-danger pull-right" style="margin-right: 20px;" (click)="bsModalRef.hide()">close</button>
    <button type="submit" class="btn btn-primary pull-right" style="margin-right: 20px;">+ Add Group</button>
  </div>
  </form>
</div>
